<template>
    <div>
        <myswiper :lunbotulist="lunbolist"></myswiper>

        <ul class="mui-table-view mui-grid-view mui-grid-9">
            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="/home/homelist">
                    <img src="../../css/menu/menu1.png" alt="">
                    <div class="mui-media-body">新闻资讯</div>
                </router-link>
            </li>
            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="/home/photolist">
                    <img src="../../css/menu/menu2.png" alt="">
                    <div class="mui-media-body">商品分享</div>
                </router-link>
            </li>
            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <router-link to="/home/goodslist">
                    <img src="../../css/menu/menu3.png" alt="">
                    <div class="mui-media-body">商品购买</div>
                </router-link>
            </li>
            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <a href="#">
                    <img src="../../css/menu/menu4.png" alt="">
                    <div class="mui-media-body">留言反馈</div>
                </a></li>
            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <a href="#">
                    <img src="../../css/menu/menu5.png" alt="">
                    <div class="mui-media-body">视频专区</div>
                </a></li>
            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <a href="#">
                    <img src="../../css/menu/menu6.png" alt="">
                    <div class="mui-media-body">联系我们</div>
                </a></li>
        </ul>
    </div>
</template>

<script>
    import myswiper from '../subcomponents/swiper.vue'

    export default {
        name: "homebar",
        data() {
            return {
                lunbolist: []
            }
        },
        methods: {
            getLunboList() {
                this.$http.get("aip/getlunbo").then(data => {
                    this.lunbolist = data.body
                })
            }
        },
        created() {
            this.getLunboList()
        }, components: {
            myswiper
        }
    }
</script>

<style scoped lang="scss">



    .mui-table-view {
        background-color: #fff;

    }

    .mui-grid-view.mui-grid-9 .mui-table-view-cell {
        border: none;
        font-size: 10px;

        img {
            width: 60px;
        }

        .mui-media-body {
            font-size: 13px;
        }
    }


</style>